<script setup lang="ts">
const props = defineProps<{ title?: string; showBackButton?: boolean }>();
const emit = defineEmits<{
  (e: 'back'): void;
}>();

function onBackClick() {
  emit('back');
}
</script>

<template>
  <div class="w-full h-full overflow-auto flex flex-col">
    <div
      v-if="props.title"
      class="flex-none py-2 text-lg font-bold text-center border-0 border-b border-solid border-border relative"
    >
      <div
        v-if="props.showBackButton"
        class="absolute left-2 top-1/2 transform -translate-y-1/2"
      >
        <a-button @click="onBackClick">返回</a-button>
      </div>
      <div>{{ props.title }}</div>
    </div>
    <div class="flex-1 overflow-auto">
      <slot></slot>
    </div>
  </div>
</template>
